@extends('layouts.root')
@section('title' , '客户后台')


<!-- 主体内容 -->
@section('contents')
    <div class="layui-fluid" style="background: #e3e3e3;">
        <div class="layui-row layui-col-space15">
            <div class="layui-col-sm6 layui-col-md3">
                <div class="layui-card">
                    <div class="layui-card-header">
                        浏览量
                        <span class="layui-badge layui-bg-blue layuiadmin-badge">今</span>
                    </div>
                    <div class="layui-card-body layuiadmin-card-list">
                        <p class="layuiadmin-big-font">{{ $data['todayPagevies'] }}</p>
                        <p>
                            总计浏览量
                            <span class="layuiadmin-span-color">{{ $data['totalPagevies'] }}<i class="layui-inline layui-icon layui-icon-flag"></i></span>
                        </p>
                    </div>
                </div>
            </div>
            <div class="layui-col-sm6 layui-col-md3">
                <div class="layui-card">
                    <div class="layui-card-header">
                        订单量
                        <span class="layui-badge layui-bg-cyan layuiadmin-badge">今</span>
                    </div>
                    <div class="layui-card-body layuiadmin-card-list">
                        <p class="layuiadmin-big-font">{{ $data['todayOrderNum'] }}</p>
                        <p>
                            总计订单量
                            <span class="layuiadmin-span-color">{{ $data['totalOrderNum'] }}
                                <i class="layui-inline layui-icon layui-icon-template-1"></i>
                            </span>
                        </p>
                    </div>
                </div>
            </div>
            <div class="layui-col-sm6 layui-col-md3">
                <div class="layui-card">
                    <div class="layui-card-header">
                        成交金额
                        <span class="layui-badge layui-bg-green layuiadmin-badge">今</span>
                    </div>
                    <div class="layui-card-body layuiadmin-card-list">

                        <p class="layuiadmin-big-font">{{ $data['todayDealNum'] }}</p>
                        <p>
                            总计成交金额
                            <span class="layuiadmin-span-color">{{ $data['totalDealNum'] }} <i class="layui-inline layui-icon layui-icon-dollar"></i></span>
                        </p>
                    </div>
                </div>
            </div>
            <div class="layui-col-sm6 layui-col-md3">
                <div class="layui-card">
                    <div class="layui-card-header">
                        展现量
                        <span class="layui-badge layui-bg-orange layuiadmin-badge">今</span>
                    </div>
                    <div class="layui-card-body layuiadmin-card-list">
                        <p class="layuiadmin-big-font">{{ $data['todayShowNum'] }}</p>
                        <p>
                            总计展现量
                            <span class="layuiadmin-span-color">{{ $data['totalShowNum'] }}
                                <i class="layui-inline layui-icon layui-icon-fire"></i></span>
                        </p>
                    </div>
                </div>
            </div>
            <div class="layui-col-sm12">
                <div class="layui-card">
                    <div class="layui-card-header">
                        商品数据
                    </div>
                    <div class="layui-card-body">
                        <div class="layui-row">
                            <div class="layui-col-sm12">
                                <div class="layui-carousel layadmin-carousel layadmin-dataview" data-anim="fade" lay-filter="LAY-index-pagetwos">
                                    <div carousel-item id="LAY-index-pagetwos">
                                        <div><i class="layui-icon layui-icon-loading1 layadmin-loading"></i></div>
                                    </div>
                                </div>
                            </div>

                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-col-sm12">
                <div class="layui-row layui-col-space15">
                    <div class="layui-col-sm6">
                        <div class="layui-card">
                            <div class="layui-card-header">在售商品</div>
                            <div class="layui-card-body">
                                {{--商品列表--}}
                                @include('layouts.table')
                            </div>
                        </div>
                    </div>
                    <div class="layui-col-sm6">
                        <div class="layui-card">
                            <div class="layui-card-header">订单列表</div>
                            <div class="layui-card-body">
                                <div class="layui-tab-content">
                                    <div class="layui-tab-item layui-show">
                                        <table id="LAY-index-prograss"></table>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection


@section('scripts')
    <script>
        layui.config({
            base: '/layuiadmin/'
        }).extend({
            index: 'lib/index',
        }).use(['index','layer','echarts','carousel','senior','table'],function(){
            var $ = layui.$,
                layer = layui.layer
                table = layui.table
                ,echarts = layui.echarts;

            layer.load(1,{shade:0.3});

            table.render({
                elem: '#LAY-user-manages'
                ,url:`{{ route('zbsuser.goods.goodsBrowseData') }}` + '?include=user'
                ,id:'demoReload'
                ,method:'POST'
                ,cellMinWidth: 80
                ,limit:10
                ,cols: [[
                    {field:'key', title:'排序',type:'numbers',width:70, align:'center', unresize: true, sort: true}
                    ,{field:'goods_name', title:'商品名',align:'right', edit: 'text'}
                    ,{field:'goods_code', title:'商品编码',align:'center', sort: true}
                    ,{field:'price', title:'价格',align:'center', sort: true}
                    ,{field:'is_show',align:'center', title:'状态', templet:function(e){
                        return e ? '<a class="layui-btn layui-btn-sm">在售</a>' : '<a class="layui-btn layui-btn-sm layui-btn-danger" >停售</a>';
                    }}
                ]]
                ,done:function(){
                }
            });

            // 订单列表
            table.render({
                elem: '#LAY-index-prograss'
                ,url:`{{ route('zbsuser.order.store') }}`
                ,id:'demoReload'
                ,method:'POST'
                ,limit:5
                ,cols: [[
                    {field:'key', title:'排序',type:'numbers',width:70, align:'center', unresize: true, sort: true,}
                    ,{field:'goods_name', title:'商品名',align:'right', edit: 'text'}
                    ,{field:'order_id', title:'订单号',align:'center',}
                    ,{field:'courier_number', title:'快递单号',align:'center',}
                    ,{field:'goods_price', title:'价格',align:'center', sort: true,}
                    ,{field:'pay_type', title:'支付状态',align:'center',}
                ]]
                ,done:function(){
                    layer.closeAll();
                }
            });


            var echartsApp = [], options = [
                {
                    tooltip : {
                        trigger: 'axis'
                    },
                    calculable : true,
                    legend: {
                        data:['浏览量','成交量','展现量']
                    },

                    xAxis : [
                        {
                            type : 'category',
                            data : {!! $month !!}
                        }
                    ],
                    yAxis : [
                        {
                            type : 'value',
                            name : '浏览量',
                            axisLabel : {
                                formatter: '{value} '
                            }
                        },
                        {
                            type : 'value',
                            name : '展现量',
                            axisLabel : {
                                formatter: '{value} '
                            }
                        }
                    ],
                    series : {!! $drawing !!}
                }
            ]
            ,elemDataView = $('#LAY-index-pagetwos').children('div')
            ,renderDataView = function(index){
                echartsApp[index] = echarts.init(elemDataView[index], layui.echartsTheme);
                echartsApp[index].setOption(options[index]);
                window.onresize = echartsApp[index].resize;
            };
            //没找到DOM，终止执行
            if(!elemDataView[0]) return;
            renderDataView(0);

        });

    </script>
@endsection